<!DOCTYPE html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <title>智能门禁</title>
    <meta name="description" content="">
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui, user-scalable=no">
    <meta http-equiv="cleartype" content="on">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/assets/public/layermobile/css/layer.css">
    <link rel="stylesheet" href="/assets/doorctrl/css/style.css"/>
    <link rel="stylesheet" href="/assets/doorctrl/css/fonts.css"/>
</head>
<body>
<div class="wraper">
    <div class="topheight">
        <div class="header font-16">
            <div class="iconfont icon-zuo back font-24"></div>
            <span>智能门禁</span>
        </div>
        <div class="font-gray padding-16">
            请选择需要操作的寝室楼
        </div>
        <div class="listbox">
        <div class="Chose">
            <div class=" chose">
                <select name="community" id="community">
                    <option value="0">请选择园区</option>
                    <volist name="communityList" id="vo">
                        <option value="{BEESCRM:$vo.community_id}">{BEESCRM:$vo.community_name}</option>
                    </volist>
                </select>

                <div class=" iconfont icon-xiaosanjiao"></div>
            </div>
            <div class=" chose border-top">
                <select name="building" id="building">
                    <option value="0">请选择楼幢</option>
                </select>

                <div class=" iconfont icon-xiaosanjiao"></div>
            </div>
            <div class="listboxx door-list">
            </div>
        </div>
    </div>

    <a class="btn open-door" href="javascript:void(0)">确认开门</a>

</div>
<input type="hidden" id="doorctrlId" name="doorctrlId" value="{BEESCRM:$doorctrlId}" />
<script type="text/javascript" src="/assets/public/seajs/sea.js"></script>
<script enter="publicjs/public" id="confnode" async="async" src="/assets/public/config.js"></script>
<script src="/assets/public/jquery-2.1.0.min.js"></script>
<script>
    window.flag = 0; //有门禁点
    $(function () {
        var height = $(window).height();
        $('.wraper').css('height', height);
        var bottom=$('.open-door').outerHeight();
        $('.topheight').css('height',height-bottom);

    })

    $(document).on('change', '#community', function () {
        var doorctrlId = $("#doorctrlId").val();
        var community_id = $(this).val();
        if (community_id == 0) {
            $("#building").html('<option value="0">请选择楼幢</option>');
        } else {
            $.ajax({
//                url: '/doorctrl/Common/getBuildingList/doorctrlId/' + doorctrlId,
                url: '/doorctrl/DoorctrlOpenRecord/getBuildingListByCommunityId/doorctrlId/' + doorctrlId,
                type: 'post',
                data: {community_id: community_id},
                dataType: 'json',
                success: function (result) {
                    var html = '<option value="0">请选择楼幢</option>';
                    if (result.status == 'S') {
                        $.each(result.data, function (key, value) {
                            html += '<option value="' + value.building_id + '">' + value.building_name + '</option>';
                        })
                        $("#building").html(html);
                    } else if (result.status == 'F') {
                        $("#building").html(html);
                    }
                }
            })
        }
    })

    $(document).on('change', '#building', function () {
        var doorctrlId = $("#doorctrlId").val();
        var building_id = $(this).val();
        if (building_id) {
            //列出楼幢下的门禁点
            $.ajax({
                url : '/doorctrl/DoorctrlOpenRecord/getAccessDoorIds/doorctrlId/' + doorctrlId,
                type : 'post',
                data : {building_id : building_id},
                dataType : 'json',
                success : function (result) {
                    var html = '';
//                        console.log(result.data);
                    if (result.status == 'S'){
                        $.each(result.data, function (key, value) {
                            html += '<div> ' +
                                    '<div class="list" data-door_id="'+ value.door_id +'">' + value.door_name + '</div> ' +
                                    '</div>';
                        })
                        $(".door-list").html(html);
                        window.flag = 0;
                    } else if(result.status == 'F'){
                        $(".door-list").html('');
                        window.flag = 1; //该楼幢没有绑定门禁点
                    }
                }
            });
        }
    })

    $(document).on('click', '.open-door', function () {
        var doorctrlId = $("#doorctrlId").val();
        var community_id = $("#community").val();
        var building_id = $("#building").val();
        if (community_id == 0) {
            fm.alert('请选择园区！');
            return false;
        }
        if (building_id == 0) {
            fm.alert('请选择楼幢！');
            return false;
        }

        if(window.flag == 1){
            fm.alert('暂无门禁点！');
            return false;
        }

        var data = {};
        var door_ids = [];

        $(".listcolor").each(function () {
            door_ids.push($(this).data('door_id'));
        })
        if (door_ids.length == 0){
            fm.alert('请选择门禁点！'); return false;
        }
        data.door_ids = door_ids;
        $.ajax({
            url: '/doorctrl/DoorctrlOpenRecord/openDoor/doorctrlId/' + doorctrlId,
            type: 'post',
            data: data,
            dataType: 'json',
            success: function (result) {
                if (result.status == 'S') {
                    fm.alert(result.message);
                } else if (result.status == 'F') {
                    fm.alert(result.message);
                }
            }
        })
    })

    $('.listbox').on('click', '.list', function () {
        $(this).toggleClass('listcolor');
    })
</script>
</body>
</html>